<template>
  <div
    class="w-full flex flex-row justify-center items-center gap-2 p-2 hover:bg-CenterHover rounded-sm"
    @click="goChat"
  >
    <n-badge :max="99" :value="SessionItem.unread === 0 ? '' : SessionItem.unread">
      <n-avatar :src="SessionItem.avatar"></n-avatar>
    </n-badge>

    <div class="flex-1 flex flex-col justify-center overflow-hidden">
      <!-- 消息顶部 -->
      <div class="flex flex-row justify-between items-center">
        <span class="text-sm text-fontRegular font-medium">
          {{ SessionItem.name }}
        </span>
        <span class="text-bold text-[10px] text-fontDisable">
          {{ formatRelativeTime(SessionItem.updatedAt) }}
        </span>
      </div>
      <!-- 消息内容 -->
      <p class="w-full max-h-[25px] text-xs text-fontPlaceholde text-nowrap text-ellipsis overflow-hidden">
        {{ RenderLastMsg(SessionItem) }}
      </p>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { MessageType } from "@/types/chat.ts";
import { ISession } from "@/types/session.ts";
import { useChat } from "@/store/modules/chat.ts";
import { useSession } from "@/store/modules/session.ts";
import { formatRelativeTime } from "@/utils/time.ts";
import { NAvatar, NBadge } from "naive-ui";
import { ISendRecordParams } from "@/types/call";

const chat = useChat();
const session = useSession();

const props = withDefaults(
  defineProps<{
    SessionItem: ISession;
  }>(),
  {},
);

function RenderLastMsg(item: ISession) {
  switch (item.sessionType) {
    case MessageType.image:
      return "【图片】";
    case MessageType.file:
      return "【文件】";
    case MessageType.videoCall:
      const videoContent = JSON.parse(item.content) as ISendRecordParams;
      return "【视频通话】" + videoContent.data;
    case MessageType.voiceCall:
      const voiceContent = JSON.parse(item.content) as ISendRecordParams;
      return "【语音通话】" + voiceContent.data;
    default:
      return item.content;
  }
}

async function goChat() {
  const { chatType, sessionId, toId: id, name, avatar } = props.SessionItem;
  chat.ChatObject = { id, chatType, sessionId, name, avatar };
  await session.RemoveUnread(sessionId);
}
</script>

<style lang="scss" scoped></style>
